<template>
  <div class="container">
    <el-row class="mb10">
      <el-col :span="16" align="left">
        <div class="flex">
          <el-input
              clearable
              v-model="searchParams.projectname"
              placeholder="项目名称"
              style="width: 120px; margin-right: 15px"
          >
          </el-input>

          <el-input
              clearable
              v-model="searchParams.applicationunit"
              placeholder="申报单位/项目负责人"
              style="width: 180px; margin-right: 15px"
          >
          </el-input>

          <el-select
              clearable
              v-model="searchParams.completionperiod"
              placeholder="完成年限"
          >
            <el-option
                :label="item.itemName"
                :value="item.itemValue"
                :key="item.itemValue"
                v-for="item in options.yearList"
            />
          </el-select>

          <el-date-picker
              style="width: 233px; margin-right: 15px"
              v-model="data.time"
              type="daterange"
              range-separator="-"
              start-placeholder="申报开始日期"
              end-placeholder="申报结束日期"
              @change="dataPickerChange"
          >
          </el-date-picker>

          <!--
                    <el-select clearable v-model="searchParams.status" placeholder="状态">
                      <el-option
                        :label="item.itemName"
                        :value="item.itemValue"
                        :key="item.itemValue"
                        v-for="item in options.statusDate"
                      />
                    </el-select>
          -->
          <el-select  v-model="data.statusUpdate" placeholder="状态">
            <el-option
                :label="item.itemName"
                :value="item.itemValue"
                :key="item.itemValue"
                v-for="item in options.statusDate"
            />
          </el-select>

          <el-button color="#626aef" @click="getListData" class="ordinary">搜索</el-button>
        </div>
      </el-col>
      <el-col :span="8" align="right">
        <!--        <el-button class="ordinary" @click="getExport()" v-limit="'KJSL:KJJL:YXKJRC:EXPERT'"> 批量导出</el-button>-->
        <el-button class="ordinary" @click="handleExport()" v-limit="'KJSL:KJJL:YXKJRC:EXPERT'"> 批量导出</el-button>
        <el-button type="danger" @click="deleteList()"  v-limit="'KJSL:KJJL:YXKJRC:DELETE'">批量删除</el-button>
        <el-button type="primary" @click="handleAdd()" v-limit="'XMZX:KYXMLXPS:KYLXSQ:APPLY'">立项申请</el-button>
        <el-button class="lock" @click="getLock()"  v-limit="'XMZX:KYXMLXPS:KYLXSQ:SUBMIT'">提交</el-button>
      </el-col>
    </el-row>

    <div class="banner">
      <el-table
          v-loading="data.allTableloading"
          class="center-table"
          :data="allTableData"
          style="width: 100%"
          @selection-change="handleSelectionChange"
          @row-dblclick="handleRowClick"
      >
        <el-table-column type="selection" width="55"  />
        <el-table-column label="序号" type="index" :index="indexMethod" width="60px"></el-table-column>
        <ColumnData v-for="column of data.columns" :key="column.label" :item="column" />
        <el-table-column label="操作" width="200" fixed="right">
          <template #default="{ row }">
            <el-button size="small" class="ordinary" v-if="row.type==1" @click="handleEdit(row)"  v-limit="'XMZX:KYXMLXPS:KYLXSQ:EDIT'"
            >编辑</el-button
            >
            <el-button type="small" class="ordinary" @click="handleDetail(row)"  v-limit="'XMZX:KYXMLXPS:KYLXSQ:DETAILS'"
            >详情</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="tc mt15">
        <el-pagination
            background
            v-model:current-page="data.page"
            v-model:page-size="data.pageSize"
            :total="data.total"
            :page-size="data.pageSize"
            @current-change="pageChange"
        />
      </div>
    </div>

    <el-dialog
        v-model="data.detailVisible"
        :append-to-body="false"
        width="900px"
        @closed="(data.detailVisible = false), (data.addFlag = 0)"
        :show-close="false"
        :close-on-cdick-modal="false"
    >
      <template #title>
        <div class="my-header">
          <el-tabs v-model="activeName" class="demo-tabs">
            <el-tab-pane :initData="data.initData" label="基本信息" name="first">
              <el-form label-position="top" status-icon>
                <el-row :gutter="20">
                  <el-col :span="12">
                    <el-form-item label="项目名称">
                      <el-input
                          placeholder="请输入"
                          disabled
                          v-model="data.detail.projectname"
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="申报单位">
                      <el-input
                          disabled
                          maxlength="11"
                          placeholder="请输入"
                          v-model="data.detail.applicationunit"
                          style="width: 100%"
                      />

                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="项目负责人">

                      <user-list-modal
                          :disabled="true"
                          v-model="data.detail.projectleader"
                          @update:modelValue="changeProject"
                          :default-users="[]"
                          :multiple="false"
                          :devType="'platform'"
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="联系电话">
                      <el-input
                          disabled
                          maxlength="11"
                          placeholder="请输入"
                          v-model="data.detail.telephone"
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="12">
                    <el-form-item label="完成年限">
                      <el-select
                          disabled
                          v-model="data.detail.completionperiod"
                          placeholder="请选择"
                          style="width: 100%"
                      >
                        <el-option
                            :label="item.itemName"
                            :value="item.itemValue"
                            :key="item.itemValue"
                            v-for="item in options.yearList"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="总投资(万元)">
                      <el-input
                          type="number"
                          :min="0"
                          disabled
                          placeholder="请输入"
                          v-model="data.detail.totalinvestment"
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="申请中咨拨款(万元)">
                      <el-input
                          type="number"
                          :min="0"
                          disabled
                          placeholder="请输入"
                          v-model="data.detail.applyfunding"
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="申报日期">
                      <el-date-picker
                          disabled
                          v-model="data.detail.reporttime1"
                          placeholder="选择日期"
                          clearable
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row> </el-row>

                <el-form-item label="主要研究内容">
                  <el-input
                      disabled
                      v-model="data.detail.researchcontents"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item label="主要技术经济指标">
                  <el-input
                      disabled
                      v-model="data.detail.mainindicators"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item label="创新点及可能获得的成果和知识产权">
                  <el-input
                      disabled
                      v-model="data.detail.describetwo"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item label="立项背景(包括项目背景、项目概况、研究的必要性等)">
                  <el-input
                      disabled
                      v-model="data.detail.backdrop"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item label="国内外研究概况及可行性分析" prop="analysis">
                  <el-input
                      disabled
                      v-model="data.detail.analysis"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item
                    label="项目研究的主要内容及技术指标(包括要解决的主要技术难点和问题，研究的创新点和内容、主要技术指标及其水平、提交的成果及形式等)"
                >
                  <el-input
                      disabled
                      v-model="data.detail.qualification"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item
                    label="项目研究的技术路线(包括拟采取的技术路线，与后续技术改造或基本建设计划的衔接等)"
                >
                  <el-input
                      disabled
                      v-model="data.detail.roadmap"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item
                    label="推广应用前景及经济效益预测(包括市场需求或推广应用前景、经济效益，形成的生产能力或有关节约工程造价、缩短工期指标等)"
                >
                  <el-input
                      disabled
                      v-model="data.detail.forecast"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item
                    label="申报单位和协作单位及分工(包括项目承担单位、主要协作单位（仅限中咨集团下属单位）简介及分工等)"
                >
                  <el-input
                      disabled
                      v-model="data.detail.dividethework"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>

                <el-form-item
                    label="项目进度计划(包括年度工作进度安排及完成期限等)(包括项目承担单位、主要协作单位（仅限中咨集团下属单位）简介及分工等)"
                >
                  <el-input
                      disabled
                      v-model="data.detail.programme"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"
                  />
                </el-form-item>
              </el-form>
            </el-tab-pane>

            <el-tab-pane label="项目经费预算" name="second">
              <!-- <Budget
                  :fatherTableJson="data.tableJson"
                  :addFlag="data.addFlag"
                  @tableJson="changeBudget"
              /> -->
              <Budget v-if="data.detailVisible" title="详情" :initData="data.tableJson" @tableJson="changeBudget" />

            </el-tab-pane>
            <el-tab-pane label="相关附件" name="4">
              <PlatformFilesxq :files="data.files" @filesParams="filesParams"   download="KJSL:KJCG:XSLW:DOWNLOAD"  upload="KJSL:KJCG:XSLW:UPLOAD" fileDelete="KJSL:KJCG:XSLW:FILEDELET"></PlatformFilesxq>
            </el-tab-pane>
            
            <el-tab-pane label="审批详情" v-if="data.approvalFormalExamination.modifyUsername" name="approvalInfo">
              <el-form class="inline-form" label-position="top" status-icon label-width="140px">
                <el-form-item label="审查结果："> {{data.approvalFormalExamination.status}} </el-form-item>
                <el-form-item label="审查人：">  {{data.approvalFormalExamination.modifyUsername}} </el-form-item>
                <el-form-item label="审查时间："> {{data.approvalFormalExamination.reviewtime}} </el-form-item>
                <el-form-item label="审查意见：">
                  <el-input type="textarea" disabled v-model="data.approvalFormalExamination.comment"></el-input>
                </el-form-item>
                <el-form-item label="附件："> 
                  <template v-if="data.approvalFormalExamination.files && data.approvalFormalExamination.files.length">
                     <div v-for="(file , i) in data.approvalFormalExamination.files" :key="'fiels' + i" style="margin-right: 10px">
                      <el-link type="primary"  :href="file.url" target="_blank">{{file.name}}</el-link>
                     </div>
                  </template>
                </el-form-item>
              </el-form>
            </el-tab-pane>
          </el-tabs>
        </div>
      </template>
      <template #footer>
        <span class="dialog-footer">
<!--          <el-button @click="data.detailVisible = false">关闭</el-button>-->
          <el-button @click="close1">关闭</el-button>
        </span>
      </template>
    </el-dialog>

    <!--新增、修改、确认弹框-->
    <el-dialog
        class="global-dialog"
        v-model="data.dialogVisible"
        :lock-scroll="false"
        :append-to-body="false"
        width="950px"
        @closed="handleClose"
        :show-close="false"
        :close-on-click-modal="false"
    >
      <template #title>
        <div class="my-header">
          <el-tabs v-model="activeName" class="demo-tabs">
            <el-tab-pane :initData="data.initData" label="基本信息" name="first">
              <el-form
                  label-position="top"
                  :rules="rules"
                  ref="ruleFormRef"
                  :model="data.ruleForm"
                  status-icon
              >
                <el-row :gutter="20">
                  <el-col :span="12">
                    <el-form-item label="项目名称" prop="projectname">
                      <el-input
                          placeholder="请输入"
                          v-model="data.ruleForm.projectname"
                          style="width: 100%"
                          maxlength="100" show-word-limit clearable
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">

                    <el-form-item label="申报单位" prop="applicationunit">
                      <popup-tree-input
                          :data="data.orgAllList"
                          :props="data.popupTreeProps"
                          :prop="
                              deptForm.parentName == null
                                ? $t('message.org.top_menu')
                                : data.ruleForm.applicationunit
                            "
                          :node-key="'' + deptForm.parentId"
                          :current-change-handle="changeUnit"
                      />


                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="项目负责人" prop="projectleaderid">
                      <user-list-modal
                          v-model="data.ruleForm.projectleader"
                          @update:modelValue="changeProject"
                          :default-users="[]"
                          :multiple="false"
                          :devType="'platform'"
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="联系电话" prop="telephone">
                      <el-input
                          maxlength="32"
                          placeholder="请输入"
                          v-model="data.ruleForm.telephone"
                          style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="20">
                  <el-col :span="12">
                    <el-form-item label="完成年限" prop="completionperiod">
                      <el-select
                          v-model="data.ruleForm.completionperiod"
                          placeholder="请选择"
                          style="width: 100%"
                      >
                        <el-option
                            :label="item.itemName"
                            :value="item.itemValue"
                            :key="item.itemValue"
                            v-for="item in options.yearList"
                        />
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="总投资(万元)" prop="totalinvestment">
                      <el-input

                          :min="0"
                          placeholder="请输入"
                          v-model="data.ruleForm.totalinvestment"
                          style="width: 100%"  maxlength="16"
                          oninput="value=value.replace(/[^\d.]/g, '')
                                            .replace(/\.{2,}/g, '.').replace('.', '$#$')
                                            .replace(/\./g, '')
                                            .replace('$#$', '.')
                                            .replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
                                            .replace(/^\./g, '')"
                          show-word-limit  clearable
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="申请中咨拨款(万元)" prop="applyfunding">
                      <el-input

                          :min="0"
                          placeholder="请输入"
                          v-model="data.ruleForm.applyfunding"
                          style="width: 100%"  maxlength="16"
                          oninput="value=value.replace(/[^\d.]/g, '')
                                            .replace(/\.{2,}/g, '.').replace('.', '$#$')
                                            .replace(/\./g, '')
                                            .replace('$#$', '.')
                                            .replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
                                            .replace(/^\./g, '')"
                          show-word-limit  clearable
                      />
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="申报日期" prop="reporttime1">
                      <el-date-picker  value-format="YYYY-MM-DD"
                                       v-model="data.ruleForm.reporttime1"
                                       placeholder="选择日期"
                                       clearable
                                       style="width: 100%"
                      />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row> </el-row>

                <el-form-item label="主要研究内容" prop="researchcontents">
                  <el-input
                      v-model="data.ruleForm.researchcontents"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入"   maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item label="主要技术经济指标" prop="mainindicators">
                  <el-input
                      v-model="data.ruleForm.mainindicators"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item label="创新点及可能获得的成果和知识产权" prop="describetwo">
                  <el-input
                      v-model="data.ruleForm.describetwo"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="立项背景(包括项目背景、项目概况、研究的必要性等)"
                    prop="backdrop"
                >
                  <el-input
                      v-model="data.ruleForm.backdrop"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item label="国内外研究概况及可行性分析" prop="analysis">
                  <el-input
                      v-model="data.ruleForm.analysis"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="项目研究的主要内容及技术指标(包括要解决的主要技术难点和问题，研究的创新点和内容、主要技术指标及其水平、提交的成果及形式等)"
                    prop="qualification"
                >
                  <el-input
                      v-model="data.ruleForm.qualification"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="项目研究的技术路线(包括拟采取的技术路线，与后续技术改造或基本建设计划的衔接等)"
                    prop="roadmap"
                >
                  <el-input
                      v-model="data.ruleForm.roadmap"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="推广应用前景及经济效益预测(包括市场需求或推广应用前景、经济效益，形成的生产能力或有关节约工程造价、缩短工期指标等)"
                    prop="forecast"
                >
                  <el-input
                      v-model="data.ruleForm.forecast"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="申报单位和协作单位及分工(包括项目承担单位、主要协作单位（仅限中咨集团下属单位）简介及分工等)"
                    prop="dividethework"
                >
                  <el-input
                      v-model="data.ruleForm.dividethework"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>

                <el-form-item
                    label="项目进度计划(包括年度工作进度安排及完成期限等)(包括项目承担单位、主要协作单位（仅限中咨集团下属单位）简介及分工等)"
                    prop="programme"
                >
                  <el-input
                      v-model="data.ruleForm.programme"
                      :autosize="{ minRows: 2, maxRows: 6 }"
                      type="textarea"
                      placeholder="请输入" maxlength="2000" show-word-limit
                  />
                </el-form-item>
              </el-form>
            </el-tab-pane>

            <el-tab-pane label="项目经费预算" name="second">
              <!-- <Budget
                  :fatherTableJson="data.tableJson"
                  :addFlag="data.addFlag"
                  @tableJson="changeBudget"
              /> -->
              <Budget v-if="data.dialogVisible" :initData="data.tableJson" @tableJson="changeBudget" />
            </el-tab-pane>
            <el-tab-pane label="相关附件" name="4">
              <PlatformFiles :files="data.files" @filesParams="filesParams"   download="KJSL:KJCG:XSLW:DOWNLOAD"  upload="KJSL:KJCG:XSLW:UPLOAD" fileDelete="KJSL:KJCG:XSLW:FILEDELET"></PlatformFiles>
            </el-tab-pane>
          </el-tabs>
        </div>
      </template>
      <template #footer>
        <span class="dialog-footer">
<!--          <el-button @click="data.dialogVisible = false">关闭</el-button>-->
          <el-button @click="close">关闭</el-button>
          <el-button type="primary" @click="submitForm()">保存</el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 导出字段选择 -->
    <Export
        :detailList="data.detailList"
        :showing="data.exportDialog"
        @close="closeExport"
        @handle-filed="handleFiled"
    ></Export>
  </div>
</template>
<script lang="ts">
import * as proxy from "@/constants/proxy";
import request from "@/utils/request";
import { validatePhoneNumber } from "@/utils/util";
import {
  getDetailById,
  getExportApply,
  getInnovativeTalentTeamLock, getApprovalById
} from "@/views/project/api/projectApplication";
import UserListModal from "@/views/project/components/UserListModal/index.vue";
import { checkPhoneNumber } from '@/views/science/common/common';
import PopupTreeInput from '@/views/science/components/PopupTreeInput/index.vue';
import ColumnData from "@/views/science/components/table/column-data.vue";
import { Modals, tips } from "@/views/science/components/tips/tips";
import PlatformFiles from "./platformFiles/platformFiles.vue";
import PlatformFilesxq from "./platformFiles/platformFilesxq.vue";
import { ElMessage, ElMessageBox } from "element-plus";
import moment from "moment";
import { ObjectType } from "typings/interfaces";
import { onMounted, reactive, ref, watch } from "vue";
// import Budget from "./budgetTable.vue";
import Budget from "@/views/project/components/BudgetTable/budgetTable.vue";
import tableData from "./tableHeader.json";
import Export from '@/views/project/components/Export/index.vue'
import {exportProjectList} from "@/views/project/api/project";
import {getStatusText} from '@/utils/index'


export default {
  components: {
    PlatformFiles,
    PlatformFilesxq,
    Budget,
    ColumnData,
    UserListModal,
    PopupTreeInput,
    Export,
  },

  setup(props, { emit }) {

    const deptForm = {
      parentId: 0,
      parentName: "",
    };
    let selectedRows: ObjectType[] = [];

    //列表显示的字段
    //模态框以及信息栏是否显示
    let data = reactive({
      tabId: '1',
      popupTreeProps: {
        label: "name",
        children: "children",
      },

      tableJson: [],
      tableJsontwo: [],
      page: 1,
      pageSize: 10,
      total: 0,
      detailForm: {
        reporttime1: null,
      },
      detail: {} as any,
      detailVisible: false,
      columns: tableData.lxsqTableHeader,
      time: [],
      initData: {},
      addFlag: 0, //变更记录是否显示
      orgAllList: [],
      recordShow: false,
      dialogVisible: false, //  新增修改确认项目弹框
      persionDialogVisible: false, //  选择参与人员弹框
      reDate: "",
      ruleForm: {
        applicationunit: "",
        projectleader: "",
        type: 1,
      } as any,
      contractBudgetList: [],
      allTableData: [],
      files: [],
      ids: [],

      exportDialog: false,
      allTableloading: false,
      detailList: [] as any,
      statusUpdate:"",//状态判断
      approvalFormalExamination: {
        modifyUsername: '',
        comment: '',
        reviewtime: '',
        status: '',
        files: []
      }
    });
    const closeExport = () => {
      data.exportDialog = false
    }
    const handleFiled = (arr) => {
      console.log(arr, 'handleFiled')
      let sdt = selectArr.map((el) => el.id);
      console.log(sdt, 'sdt')
      console.log([sdt.join(",")], '[sdt.join(",")]')
      if (arr.length > 0) {
        ElMessageBox.confirm('您确认导出查询数据吗？', '批量导出', {
          confirmButtonText: '确认',
          cancelButtonText: '取消',
          type: 'warning',
        }).then(() => {
          // exportProjectList({ ...searchParams, ids: sdt.join(",") , headList: arr }, '科研项目数据表格')
          getExportApply({ ...searchParams,ids:[sdt.join(",")] , headList: arr}, "科研立项申请");
          console.log('批量导出')
          data.exportDialog = false
        })
      }
    }
    const handleExport = () => {
      data.exportDialog = true
      data.detailList = [
        { fieldName: 'projectname', title: '项目名称' },
        { fieldName: 'applicationunit', title: '申请单位' },
        { fieldName: 'projectleader', title: '项目负责人' },
        { fieldName: 'telephone', title: '联系电话' },
        { fieldName: 'completionperiod', title: '完成年限' },
        { fieldName: 'totalinvestment', title: '总投资(万元)' },
        { fieldName: 'applyfunding', title: '申请中咨拨款（万元）' },
        { fieldName: 'reporttime1', title: '申报日期' },
        { fieldName: 'researchcontents', title: '主要研究内容' },
        { fieldName: 'mainindicators', title: '主要技术经济指标' },
        { fieldName: 'describetwo', title: '创新点及可能获得的成果和知识产权' },
        { fieldName: 'backdrop', title: '立项背景' },
        { fieldName: 'analysis', title: '国内外研究概况及可行性分析' },
        { fieldName: 'qualification', title: '项目研究的主要内容及技术指标' },
        { fieldName: 'roadmap', title: '项目研究的技术路线' },
        { fieldName: 'forecast', title: '推广应用前景及经济效益预测' },
        { fieldName: 'dividethework', title: '申报单位和协作单位及分工' },
        { fieldName: 'programme', title: '项目进度计划' },
      ]
    }


    let filesParams = (params) => {
      data.files = params;
    };
    let close = () => {
      data.dialogVisible = false;
      activeName.value = "first";
      data.addFlag = 0;
      data.files = [];
    };
    let close1 = () => {
      data.detailVisible = false;
      activeName.value = "first";
      data.addFlag = 0;
      data.files = [];
    };
    let selectArr: Config[] = reactive([]);
    // let selectArr: any = reactive([]);
    const handleSelectionChange = (val) => {
      selectArr = val;
      data.ids = val.id;
      console.log(selectArr, "selectArr");
      console.log(data.ids, "data.ids");
    };
    const indexMethod = (index)=>{
      return data.pageSize*(data.page-1) +index+1
    }
    let loading = ref(true);
    // 查询参数
    let searchParams = reactive({
      type: 1,
      typeParams: 1,
      startTime: null,
      endTime: null,
    }) as any;
    //进入获取表单数据

    const options: any = reactive({
      yearList: [
        { itemName: "2026年", itemValue: 2026 },
        { itemName: "2025年", itemValue: 2025 },
        { itemName: "2024年", itemValue: 2024 },
        { itemName: "2022年", itemValue: 2022 },
        { itemName: "2021年", itemValue: 2021 },
        { itemName: "2020年", itemValue: 2020 },
        { itemName: "2019年", itemValue: 2019 },
      ],
      statusDate: [
        { itemName: "全部", itemValue: "10" },
        { itemName: "待提交", itemValue: "1" },
        // { itemName: "待审批", itemValue: "12" },
        // { itemName: "审查通过", itemValue: "2" },
        { itemName: "审批不通过", itemValue: "3" },
        { itemName: "已退回", itemValue: "11" },
        { itemName: "形式审查中", itemValue: "4" },
        { itemName: "专家初审中", itemValue: "5" },
        { itemName: "立项审查中", itemValue: "6" },
        { itemName: "工作大纲审查中", itemValue: "7" },
        { itemName: "领导班子会审中", itemValue: "8" },
        { itemName: "已批准立项", itemValue: "9" },
      ],
      unitnameList: [],
      affiliationList: [],
      SoftnessList: [],
      classnameList: [],
      competitionclassList: [],
      belongingunitList: [],
      awardList: [],
      zlztList: [],
      jsflList: [],
      xmlbList: [],
      yhrenList: [],
    });

    // 清除日期选择器,删除的时候将日期清空
    const dataPickerChange = () => {
      if (data.time) {
        searchParams.startTime = data.time[0];
        searchParams.endTime = data.time[1];
      } else {
        searchParams.startTime = null;
        searchParams.endTime = null;
        data.time = [];
      }
    };

    // 提交按钮

    let getLock = () => {
      console.log(111,selectArr.length)
      if (selectArr.length >= 1 ) {
        let flag = selectArr.every((item) => {
          return (item.status == "待提交"||item.status == "已退回")
        })
        if (!flag) {
          ElMessage({
            message: '仅能提交待提交和已退回状态的申请',
            type: 'warning',
          })
          return
        }
        Modals("是否提交选择内容", "提示", "warning")
          .then(async () => {
            let sdt = selectArr.map((el) => el.id);
            let res = await getInnovativeTalentTeamLock({
              applicationid: sdt.join(","),
              type: 2,
              status: 1,
            });
            if (res.data.success) {
              tips("提交成功", "success");
              selectArr = [];
              getListData();
            }
          })
          .catch(() => {
            console.log("点击了取消");
          });
      } else if (selectArr.length == 0) {
        tips("请至少选择一条数据", "warning");
      }

    };
    // 预算

    let changeBudget = (parmas) => {
      console.log('changeBudget');
      data.tableJson = parmas.contractBudgetList;
    };

    const changeUnit = (item) => {


      data.ruleForm.applicationunit = item.name;
      data.ruleForm.applicationunitid = item.id;
    };

    const changeProject = (val) => {

      data.ruleForm.projectleader = val.cname;
      data.ruleForm.projectleaderid = val.userId;
    };

    const pageChange = (current) => {
      data.page = current;
      getListData();
    };

    const getListData = async () => {
      selectArr = [];
      loading.value = true;
      data.allTableloading = true;
      if(data.statusUpdate == "1"){
        searchParams.type=1;
        searchParams.status=1;
        searchParams.typeParams=0;
      } else if (data.statusUpdate =="2"){
        searchParams.type=1;
        searchParams.status=2;
        searchParams.typeParams=3;
      } else if (data.statusUpdate =="3"){
        searchParams.type=1;
        searchParams.status=3;
        searchParams.typeParams=3;
      } else if (data.statusUpdate =="4"){
        searchParams.type=2;
        searchParams.status=1;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="5"){
        searchParams.type=3;
        searchParams.status=1;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="6"){
        searchParams.type=4;
        searchParams.status=1;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="7"){
        searchParams.type=5;
        searchParams.status=1;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="8"){
        searchParams.type=6;
        searchParams.status=1;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="9"){
        searchParams.type=7;
        searchParams.status=2;
        searchParams.typeParams=0;

      } else if (data.statusUpdate =="10"){
        searchParams.type=1;
        searchParams.typeParams=1;
        delete searchParams.status;

      } else if (data.statusUpdate =="11"){
        searchParams.type=1;
        searchParams.status=4;
        searchParams.typeParams=0;
      } else if (data.statusUpdate == "12"){
        searchParams.type=2;
        searchParams.status=1;
        searchParams.typeParams=3;
      }

      console.log(1111,searchParams)
      return request({
        url: proxy.CHECC_API_CMS + "/xmzx/kyxmlxps/approvalApplication/getTotalList",
        method: "post",
        data: {
          ...searchParams,
          page: data.page,
          pageSize: data.pageSize,
        },
      })
          .then((res) => {
            console.log(2222,searchParams)
            let resData = res.data.data.records;

            //草稿、待审批、审批通过、审批拒绝、已退回
            resData.map((item) => {
              if (item.status == 1&&item.type == 1) {
                item.status = "待提交";
              } else if (item.status == 2&&item.type == 1) {
                item.status = "审批通过";
              } else if (item.status == 3&&item.type == 1) {
                item.status = "审批不通过";
              } else if (item.status == 4&&item.type == 1) {
                item.status = "已退回";
              } else if (item.status == 1&&item.type == 2) {
                item.status = "形式审查中";
              } else if (item.status == 3&&item.type == 2) {
                item.status = "形式审查不通过";
              } else if (item.status == 1&&item.type == 3) {
                item.status = "专家初审中";
              }  else if (item.status == 8&&item.type == 3) {
                item.status = "专家初审中";
              } else if (item.status == 3&&item.type == 3) {
                item.status = "专家初审不通过";
              } else if (item.status == 1&&item.type == 4) {
                item.status = "立项审查中";
              } else if (item.status == 3&&item.type == 4) {
                item.status = "立项审查不通过";
              } else if (item.status == 1&&item.type == 5) {
                item.status = "工作大纲审查中";
              } else if (item.status == 4&&item.type == 5) {
                item.status = "工作大纲审查中";
              } else if (item.status == 3&&item.type == 5) {
                item.status = "工作大纲审查不通过";
              } else if (item.status == 1&&item.type == 6) {
                item.status = "领导班子会审中";
              } else if (item.status == 3&&item.type == 6) {
                item.status = "领导班子会审不通过";
              } else if (item.status == 1&&item.type == 7) {
                item.status = "批准立项中";
              }  else if (item.status == 2&&item.type == 7) {
                item.status = "已批准立项";
              } else if (item.status == 3&&item.type == 7) {
                item.status = "批准立项不通过";
              }
              if (item) {
                item.reporttimeFormat = moment(item.reporttime).format("YYYY-MM-DD");
              }
            });
            allTableData.value = resData;
            data.allTableloading = false;
            data.total = res.data.data.total;
          }).finally(() => {
            loading.value = false;
          });
    };
    getListData();

    const ruleFormRef = ref();

    watch(() => data.tableJson, () => {
      console.log(data.tableJson,'data.tableJson改变');
    },{deep: true})
    //新增按钮,清除新增的内容.....
    const handleAdd = () => {
      data.addFlag = 0;
      editId = "";
      data.tableJson = [];
      ruleFormRef.value.validateField();
      data.initData = {};
      data.dialogVisible = true;
    };
    const handleClose = () => {
      for (let key in data.ruleForm) {
        data.ruleForm[key] = "";
      }
      activeName.value = "first";
      data.addFlag = 0;
    };
    // 判断
    const rules = reactive({
      projectname: [{ required: true, message: "请输入项目名称", trigger: "blur" }],

      applicationunit: [{ required: true, message: "请选择申报单位", trigger: "change" }],

      projectleaderid: [
        { required: true, message: "请选择项目负责人", trigger: "change" },
      ],

      telephone: [{ required: true, message: "请输入联系电话", trigger: "blur" },
        { validator: checkPhoneNumber, trigger: "blur" },

      ],

      completionperiod: [
        { required: true, message: "请选择完成年限", trigger: "change" },
      ],

      totalinvestment: [
        { required: true, message: "请输入总投资(万元)", trigger: "change" },
      ],

      applyfunding: [
        { required: true, message: "申请中咨拨款(万元)", trigger: "change" },
      ],

      reporttime1: [{ required: true, message: "请选择申报日期", trigger: "change" }],
      status: [{ required: true, message: "请选择状态", trigger: "change" }],
    });
    const ruleForm = reactive({});
    // 保存按钮
    const submitForm = async () => {
      await ruleFormRef.value.validate((valid) => {
        if (valid) {
          if (!validatePhoneNumber(data.ruleForm.telephone)) {
            tips("联系电话格式不正确！", "warning");
            return false;
          }
          data.ruleForm.type = 1;
          const config: Record<string, any> = {
            info: {
              ...data.ruleForm,
            },
            contractBudgetList: data.tableJson,
            fileList:data.files,
          };
          loading.value = true;
          return request({
            url:
                proxy.CHECC_API_CMS +
                `/xmzx/kyxmlxps/approvalApplication/${editId ? "update" : "insert"}`,
            method: "post",
            data: config,
          }).then(() => {
            getListData();
            data.dialogVisible = false;
            return ElMessage({
              message: "操作成功",
              type: "success",
            });
          });
        } else {
          return ElMessage({
            message: "请将基本信息补充完整",
            type: "warning",
          });
        }
      });
    };

    const handleEditItem = (row) => {
      row.isEdit = true;
    };
    const cancelItem = (row) => {
      row.isEdit = false;
    };

    //编辑按钮
    let editId = "";
    const handleEdit = async (row) => {
      data.tableJson = [];
      editId = row.id;
      activeName.value = 'first'
      let res = await getDetailById(row.id);
      if (res.data.success) {
        data.ruleForm = { ...res.data.data.info };
        data.tableJson = res.data.data.contractBudgetList;
        console.log("编辑按钮", data.tableJson);
        data.files = res.data.data.files;
        data.addFlag = 1;
        data.dialogVisible = true;
      }

    };
    const handleRowClick = (row) => {
      handleDetail(row)
    }

    //详情按钮
    let handleDetail = async (row) => {
      data.tableJson = [];
      activeName.value = 'first'
       getApprovalById(row.id).then(arew => {
      if(arew.data.success) {
        let item = arew.data.data.approvalFormalExamination
        if(item) {
          let file = item.examinationurl ? JSON.parse(item.examinationurl) : []
          item.reviewtime = moment(item.reviewtime).format('YYYY-MM-DD hh:mm:ss')
          item.files = file
          debugger
          if(item.status === 1  && item.type === '1') {
              data.approvalFormalExamination = {
              modifyUsername: '',
              comment: '',
              reviewtime: '',
              status: '',
              files: []
            }
          } else {
            data.approvalFormalExamination = item
            data.approvalFormalExamination.status = getStatusText([Number(item.status), Number(item.type)])
          }
        } else {
          data.approvalFormalExamination = {
            modifyUsername: '',
            comment: '',
            reviewtime: '',
            status: '',
            files: []
          }
        }
     
      }
     })
      let res = await getDetailById(row.id);
      if (res.data.success) {
        data.detail = { ...res.data.data.info };
        data.tableJson = res.data.data.contractBudgetList;
        data.files = res.data.data.files;
        data.addFlag = 2;
        data.detailVisible = true;
      }
    };

    let deleteList = () => {
      if (!selectArr.length) {
        ElMessage({
          message: "请选择",
          type: "warning",
        });
        return;
      }
      ElMessageBox.confirm("是否删除选择内容", "提示", {
        type: "warning",
      })
          .then(() => {
            let ewew = 0;
            console.log(111,selectArr)
            selectArr.forEach(item => {
              for (let i = 0; i < selectArr.length; i++) {
                console.log(222,item.type)
                if(item.type!="1"){
                  ewew=1
                }
              }
            });
            if(ewew != 0){
              tips("处于科研立项申请才可以删除", "warning");
              selectArr = [];
              getListData();
            }else{
              loading.value = true;
              let sdt = selectArr.map((el) => el.id);
              return request({
                url: proxy.CHECC_API_CMS + `/xmzx/kyxmlxps/approvalApplication/delete`,
                method: "post",
                params: {
                  id: sdt.join(","),
                },
              }).then(() => {
                ElMessage({
                  message: "删除成功",
                  type: "success",
                });
                selectArr = [];
                getListData();
              });
            }

          })
          .catch(() => {
            console.log("点击了取消");
          });
    };

    const getExport = async () => {
      Modals("是否导出全部数据", "提示", "warning")
          .then(async () => {
            await getExportApply(searchParams, "科研立项申请");
          })
          .catch(() => {
            console.log("点击了取消");
          });
    };
    //page分页
    let getpageData = () => {
      selectArr = [];
      getListData();
    };

    // 单位
    const unitname = () => {
      request({
        url: "/checc-api/kgptKjslTchieveSttrans/unitname",
        method: "post",
      }).then((res) => {
        options.unitnameList = res.data.data;
      });
    };
    //承载单位
    const czdw = () => {
      return request({
        url: proxy.CHECC_API_CMS + "/org/getSysOrgList",
        method: "get",
      }).then(res => {
        data.orgAllList = res.data.data
      })
    };
    //用户单位
    const yonghu = () => {
      request({
        url: "/checc-api/user/getAll",
        method: "get",
      }).then((res) => {
        options.yhrenList = res.data.data;
      });
    };

    // 字段获取
    const affiliation = () => {
      request({
        url: proxy.CHECC_API_CMS + "/dictItem/codelist",
        method: "post",
        data: [
          "KJSL_PATENT_STATUS",
          "KJSL_PATENT_TYPE",
          "KJSL_PATENT_STATUS",
          "KJSL_BUSINESS_SECTOR",
          "KJSL_SOFT_STATE",
        ],
      }).then((res) => {
        options.affiliationList = res.data.data.KJSL_PATENT_STATUS;

        options.competitionclassList = res.data.data.KJSL_PATENT_TYPE;

        options.zlztList = res.data.data.KJSL_PATENT_STATUS;

        options.jsflList = res.data.data.KJSL_BUSINESS_SECTOR;

        options.awardList = res.data.data.KJSL_SOFT_STATE;
      });
    };

    onMounted(() => {
      unitname();
      affiliation();
      czdw();
      yonghu();
    });

    //初始页面和数据
    const activeName = ref("first");
    const budgetYear = ref("2023");
    const choosePersion = () => {
      // 选择参与人员按钮事件
      data.persionDialogVisible = true;
    };

    // 列表
    let allTableData = ref([]);

    //勾选参数
    interface Config {
      id: string;
      type: string;
      status: string;
    }

    // 参与人员列表
    let allJoinList = ref([]);
    let searchJoin = reactive({
      name: "", //名称
      unitOrg: "", //机构ID
    });

    const clrJoin = (e) => {
      console.log("删除的参与人员", e);
    };

    return {
      data,
      getLock,
      changeBudget,
      changeUnit,
      dataPickerChange,
      allTableData, //新增修改的表单数据
      ruleForm, //新增表单数据
      ruleFormRef, //加载表单数据
      rules,
      submitForm, //新增保存
      handleAdd, // 新增
      handleEdit, //编辑
      handleClose,
      handleEditItem,
      cancelItem,
      handleDetail, //确认
      getListData, // 获取列表信息
      getpageData, // 分页信息
      pageChange,
      changeProject,
      deleteList, //删除list
      selectArr, //选择的list
      getExport,
      options, //维护单位字典
      selectedRows,
      searchParams,
      //下拉选
      unitname,
      //字段取值
      choosePersion,
      activeName,
      budgetYear,
      allJoinList,
      searchJoin,
      deptForm,
      handleSelectionChange,
      indexMethod,
      filesParams,
      close,
      close1,
      closeExport,
      handleFiled,
      handleExport,
      handleRowClick,
    };
  },
};
</script>
<style lang="scss" scoped>
.container {
  background-color: white;
  padding: 20px;
}

.el-col {
  line-height: 40px;
}

:deep(.center-table td),
:deep(.center-table th) {
  text-align: center !important;
}

.el-form-item {
  .el-input {
    width: 100px;
    background-color: aliceblue;
  }

  .el-select {
    width: 100px;
  }
}

.custom-color {
  color: red !important;
  /* 确保优先级高于其他样式 */
}
.el-table th {
  background-color: #f0f0f0;
  color: #333;
}

:deep(.demo-tabs > .el-tabs__content) {
  max-height: 500px;

  overflow-y: scroll;

  scrollbar-width: none;

  -ms-overflow-style: none;
}

:deep(.el-dialog__body) {
  display: none;
}

.open-title {
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}

/deep/ .el-dialog__body {
  display: block !important;
}

.mt15 {
  margin: 20px 0px;
}

.mb10 {
  margin-bottom: 10px;
}

.tc {
  text-align: center;
}
.inline-form::v-deep {
  .el-form-item {
    display: flex;
  }
  .el-form-item__label {
    width: 120px;
    text-align: right;
  }
  .el-form-item__content {
    opacity: .8;
  }
}
</style>
